<template>
  <view class="page">
    <Header></Header>
    <view class="main_container">
      <view class="main_content">
        <Breadcrumb :text="'个人评测-听说考试'"> </Breadcrumb>
        <view class="content">
          <view class="list" v-if="bookList.length > 0">
            <view
              class="item"
              v-for="(item, index) in bookList"
              :key="index"
              @click="startLearning(item)"
            >
              <view class="item_container">
                <view class="item_img">
                  <image :src="item.imageUrl" mode="widthFix"></image>
                </view>
                <view class="item_content">
                  <view class="item_title">
                    <text>{{ item.name }}</text>
                  </view>
                  <view class="item_introduction">
                    {{ item.introduction }}
                  </view>
                </view>
              </view>
              <view class="item_button">
                <view class="item_button_content">
                  <text>去学习</text>
                </view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import { bookPage } from "@/api/elst";
export default {
  components: {},
  data() {
    return {
      bookList: [],
    };
  },
  onLoad() {
    this.init();
  },
  methods: {
    init() {
      bookPage().then((res) => {
        this.bookList = res.data.records;
      });
    },
    startLearning(item) {
      uni.navigateTo({
        url: `/pages/examination/examinationList?id=${item.id}`,
      });
    },
  },
};
</script>

<style lang="scss" scoped>
@import "./examination.scss";
</style>
